<template>
  <div class="articles">
    <Header />
    <NavBar :title="title" />

    <div class="articles-list">
      <van-list
        v-model:loading="pageParams.loading"
        v-model:error="pageParams.error"
        :finished="pageParams.finished"
        :finished-text="pageParams.finishedText"
        error-text="暂时没有更多数据"
        @load="onLoad"
      >
        <ListItem
          v-for="(item, index) in list"
          :key="index"
          :title="item.title"
          :label="item.dateandtime"
          :fid="item.Fid"
          :typeid="typeid"
          @click="handleClick(item)"
        />
      </van-list>
    </div>
    <footer></footer>
  </div>
</template>

<script>
import { ref, onMounted } from "vue";

import { List } from "vant";

import Header from "@/components/Header.vue";
import Footer from "@/components/footer.vue"
import NavBar from "@/components/NavBar.vue";
import ListItem from "./components/ListItem.vue";
import { useRoute, useRouter } from "vue-router";

import { getregulationsList } from "@/api/index";

export default {
  components: {
    Header,
    NavBar,
    Footer,
    ListItem,
    [List.name]: List,
  },
  setup() {
    const typeMap = {
      Recruitment: {
        title: "招考信息",
        typeid: "55",
      },
      Policy: {
        title: "就业政策",
        typeid: "48",
      },
      Entrepreneurship: {
        title: "创业政策",
        typeid: "49",
      },
      Training: {
        title: "培训政策",
        typeid: "50",
      },
      Improve: {
        title: "学历提升",
        typeid: "51",
      },
      TaxIncentives: {
        title: "税收优惠",
        typeid: "52",
      },
      PolicyText: {
        title: "政策原文",
        typeid: "53",
      },
      Questionnaire: {
        title: "问卷调查",
        typeid: "47",
      },
    };

    const pageParams = ref({
      loading: false,
      finished: false,
      error: false,
      page: 1,
      pageSize: 2,
      finishedText: "没有更多了",
    });

    let list = ref([]);
    const route = useRoute();
    const router = useRouter();
    const name = route.name;
    console.log("name",name)
    let title = typeMap[name].title;
    let typeid = typeMap[name].typeid;

    // 获取列表
    const getData = async () => {
      let params = {
        page: pageParams.value.page - 1,
        page_size: 20,
        typeid: '',
      };

      if (typeid) {
        params.typeid = typeid; // 44 最新资讯(就业所),45 政策法规(就业所),46 现场招聘(就业所)
      }
      pageParams.value.loading = true;
      try {
        let { data, pageparam } = await getregulationsList(params);
        pageParams.value.page++
        pageParams.value.loading = false;
        data = data.map(item => {
          item.dateandtime = item.dateandtime && item.dateandtime.slice(0, 10)
          return item
        })
        list.value.push(...data);

        if (!data.length && pageParams.value.page == 1) {
          pageParams.value.finishedText = "很抱歉，未找到符合要求的信息！";
        } else {
          pageParams.value.finishedText = "没有更多了";
        }
        if (list.value.length >= pageparam.sums) {
          pageParams.value.finished = true;
        }
      } catch (error) {
        pageParams.value.error = true;
        console.error(error);
      }
    };
    const onLoad = () => {
      getData();
    };

    onMounted(() => {
      getData();
    });

    const handleClick = (item) => {
      if (typeid) {
        router.push({ path: "/article/detail", query: { fid: item.Fid } });
      } else {
        let url = "http://m.gzrc.com.cn/jobdetail_" + item.Fid + ".htm";
        window.open(url, "_blank");
      }
    };



    return {
      title,
      pageParams,
      list,
      typeid,
      onLoad,
      handleClick,
    };
  },
};
</script>

<style lang="scss" scoped>
.articles {
  &-list {
    margin-bottom: 20px;
    padding: 0 16px;
  }
}
</style>>